<!doctype html>
<html lang="zn-cn">
<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  <title>jQuery Ajax Pagiation - jPages</title>
  <meta name="keywords" content="jquery, pagination, javascript, plugin"/>
  <meta name="viewport" content="width=device-width,initial-scale=1">
  <link rel="stylesheet" href="assets/style.css">
  <link rel="stylesheet" href="assets/jPages.css">
  <link rel="stylesheet" href="assets/animate.css">
  <link rel="stylesheet" href="assets/github.css">
  <link rel="stylesheet" href="http://dreamsky.github.io/main/blog/common/init.css">
  <style type="text/css">
  .holder {
    margin: 15px 0;
  }
  .holder a {
    font-size: 12px;
    cursor: pointer;
    margin: 0 5px;
    color: #fff;
  }
  .holder a:hover {
    background-color: #eee;
    color: #fff;
  }
  .holder a.jp-previous { margin-right: 15px; }
  .holder a.jp-next { margin-left: 15px; }
  .holder a.jp-current, a.jp-current:hover {
    color: #FF4242;
    font-weight: bold;
  }
  .holder a.jp-disabled, a.jp-disabled:hover {
    color: #eee;
  }
  .holder a.jp-current, a.jp-current:hover,
  .holder a.jp-disabled, a.jp-disabled:hover {
    cursor: default;
    background: none;
  }
  .holder span { margin: 0 5px; }
  div#content {
  	width: 700px;
  }
  div#container {
  	width: 730px;
  	margin: 100px auto;
  }
  body {
  	background: #333;
  	color: #eee;
  }
  </style>  
  <script type="text/javascript" src="assets/jquery-1.8.2.min.js"></script>
  <script type="text/javascript" src="assets/highlight.pack.js"></script>
  <script type="text/javascript" src="assets/tabifier.js"></script>
  <script src="assets/js.js"></script>
  <script src="assets/jPages.js"></script>
  <script src="http://dreamsky.github.io/main/blog/common/init.js"></script>
  <script>
  /* when document is ready */
  $(function() {
    /* initiate plugin */
    $("div.holder").jPages({
      containerID: "itemContainer",
      perPage: 5
    });
  });
  </script>
</head>
<body>
  <div id="container" class="clearfix">
    <!--! end of #sidebar -->
    <div id="content" class="defaults">
    	<!-- navigation holder -->
      <div class="holder">
      </div>
      <!-- item container -->
      <ul id="itemContainer">
        <li><img src="http://luis-almeida.github.io/jPages/img/img (1).jpg" alt="image"></li>
        <li><img src="http://luis-almeida.github.io/jPages/img/img (2).jpg" alt="image"></li>
        <li><img src="http://luis-almeida.github.io/jPages/img/img (3).jpg" alt="image"></li>
        <li><img src="http://luis-almeida.github.io/jPages/img/img (4).jpg" alt="image"></li>
        <li><img src="http://luis-almeida.github.io/jPages/img/img (5).jpg" alt="image"></li>
        <li><img src="http://luis-almeida.github.io/jPages/img/img (6).jpg" alt="image"></li>
        <li><img src="http://luis-almeida.github.io/jPages/img/img (7).jpg" alt="image"></li>
        <li><img src="http://luis-almeida.github.io/jPages/img/img (8).jpg" alt="image"></li>
        <li><img src="http://luis-almeida.github.io/jPages/img/img (9).jpg" alt="image"></li>
        <li><img src="http://luis-almeida.github.io/jPages/img/img (10).jpg" alt="image"></li>

		<li><img src="http://luis-almeida.github.io/jPages/img/img (1).jpg" alt="image"></li>
        <li><img src="http://luis-almeida.github.io/jPages/img/img (2).jpg" alt="image"></li>
        <li><img src="http://luis-almeida.github.io/jPages/img/img (3).jpg" alt="image"></li>
        <li><img src="http://luis-almeida.github.io/jPages/img/img (4).jpg" alt="image"></li>
        <li><img src="http://luis-almeida.github.io/jPages/img/img (5).jpg" alt="image"></li>
        <li><img src="http://luis-almeida.github.io/jPages/img/img (6).jpg" alt="image"></li>
        <li><img src="http://luis-almeida.github.io/jPages/img/img (7).jpg" alt="image"></li>
        <li><img src="http://luis-almeida.github.io/jPages/img/img (8).jpg" alt="image"></li>
        <li><img src="http://luis-almeida.github.io/jPages/img/img (9).jpg" alt="image"></li>
        <li><img src="http://luis-almeida.github.io/jPages/img/img (10).jpg" alt="image"></li>

        <li><img src="http://luis-almeida.github.io/jPages/img/img (1).jpg" alt="image"></li>
        <li><img src="http://luis-almeida.github.io/jPages/img/img (2).jpg" alt="image"></li>
        <li><img src="http://luis-almeida.github.io/jPages/img/img (3).jpg" alt="image"></li>
        <li><img src="http://luis-almeida.github.io/jPages/img/img (4).jpg" alt="image"></li>
        <li><img src="http://luis-almeida.github.io/jPages/img/img (5).jpg" alt="image"></li>
        <li><img src="http://luis-almeida.github.io/jPages/img/img (6).jpg" alt="image"></li>
        <li><img src="http://luis-almeida.github.io/jPages/img/img (7).jpg" alt="image"></li>
        <li><img src="http://luis-almeida.github.io/jPages/img/img (8).jpg" alt="image"></li>
        <li><img src="http://luis-almeida.github.io/jPages/img/img (9).jpg" alt="image"></li>
        <li><img src="http://luis-almeida.github.io/jPages/img/img (10).jpg" alt="image"></li>        
        
        <li><img src="http://luis-almeida.github.io/jPages/img/img (1).jpg" alt="image"></li>
        <li><img src="http://luis-almeida.github.io/jPages/img/img (2).jpg" alt="image"></li>
        <li><img src="http://luis-almeida.github.io/jPages/img/img (3).jpg" alt="image"></li>
        <li><img src="http://luis-almeida.github.io/jPages/img/img (4).jpg" alt="image"></li>
        <li><img src="http://luis-almeida.github.io/jPages/img/img (5).jpg" alt="image"></li>
        <li><img src="http://luis-almeida.github.io/jPages/img/img (6).jpg" alt="image"></li>
        <li><img src="http://luis-almeida.github.io/jPages/img/img (7).jpg" alt="image"></li>
        <li><img src="http://luis-almeida.github.io/jPages/img/img (8).jpg" alt="image"></li>
        <li><img src="http://luis-almeida.github.io/jPages/img/img (9).jpg" alt="image"></li>
        <li><img src="http://luis-almeida.github.io/jPages/img/img (10).jpg" alt="image"></li>

        <li><img src="http://luis-almeida.github.io/jPages/img/img (1).jpg" alt="image"></li>
        <li><img src="http://luis-almeida.github.io/jPages/img/img (2).jpg" alt="image"></li>
        <li><img src="http://luis-almeida.github.io/jPages/img/img (3).jpg" alt="image"></li>
        <li><img src="http://luis-almeida.github.io/jPages/img/img (4).jpg" alt="image"></li>
        <li><img src="http://luis-almeida.github.io/jPages/img/img (5).jpg" alt="image"></li>
        <li><img src="http://luis-almeida.github.io/jPages/img/img (6).jpg" alt="image"></li>
        <li><img src="http://luis-almeida.github.io/jPages/img/img (7).jpg" alt="image"></li>
        <li><img src="http://luis-almeida.github.io/jPages/img/img (8).jpg" alt="image"></li>
        <li><img src="http://luis-almeida.github.io/jPages/img/img (9).jpg" alt="image"></li>
        <li><img src="http://luis-almeida.github.io/jPages/img/img (10).jpg" alt="image"></li>
      </ul>
      <!-- navigation holder -->
      <div class="holder">
      </div>
    </div>
    <!--! end of #content -->
  </div>
  <div class="footer-banner" style="width:728px; margin:160px auto 0"></div>
</body>
</html>